<template>
  <h2>羊只转舍-新增</h2>
  <div>
    <el-form
      :model="form"
      label-width="auto"
      style="max-width: 1000px"
      :inline="true"
    >
      <el-button type="danger" @click="Transfer()">+ 新增</el-button>
      <el-button type="danger">保存</el-button>
      <el-button type="danger">撤销</el-button>
      <el-button type="danger">删除</el-button>
    </el-form>
  </div>
  <br />
  <table>
    <tr>
      <td>
        <el-form-item label="转种日期">
          <el-date-picker
            v-model="form.transplantingDate"
            type="date"
            placeholder="Pick a Date"
            format="YYYY-MM-DD"
            style="width: 150px"
          />
        </el-form-item>
      </td>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <td>
        <el-form-item label="单据号">
          ————
        </el-form-item>
      </td>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <td>
        <el-form-item label="流水号">
         ————
        </el-form-item>
      </td>
    </tr>
  </table>
  <hr />
  <br />
  <table border="1" width="1000px" style="border-collapse: collapse">
    <tr>
      <td>序号</td>
      <td>羊只耳号</td>
      <td>转入栋舍</td>
      <td>转入栏位</td>
      <td>品种</td>
      <td>性别</td>
      <td>当前栋舍</td>
      <td>当前栏位</td>
    </tr>
    <div></div>
  </table>
  <div v-if="form.Rang != ''">
    <table>
      <tr>
        <td
          width="70px"
          style="
            text-align: center;
            background-color: #fff;
            color: #000;
            border-radius: 150px;
          "
        >
          1
        </td>
        <td>
          <el-select
            v-model="form.breedingSheepArchiveId"
            placeholder="请选择"
            style="width: 155px"
          >
            <el-option
              v-for="a in bugles"
              :label="a.auricle"
              :value="a.breedingSheepArchiveId"
              @click="TransferBack()"
            />
          </el-select>
        </td>
        <td>
          <el-select
            v-model="form.buildingsEnter"
            placeholder="请选择"
            style="width: 155px"
          >
            <el-option
              v-for="a in buildingList"
              :label="a.buildingName"
              :value="a.buildingId"
              @click="getcolumnsOut()"
            />
          </el-select>
        </td>
        <td>
          <el-select
            v-model="form.columnsEnter"
            placeholder="请选择"
            style="width: 135px"
          >
            <el-option
              v-for="a in columnsOu"
              :label="a.columnsName"
              :value="a.columnsId"
            />
          </el-select>
        </td>
        <td>
          <el-select
            v-model="form.sheepvarietyId"
            placeholder="请选择"
            style="width: 77px"
          >
            <el-option
              v-for="i in sheepvarietyList"
              :label="i.sheepvarietyName"
              :value="i.sheepvarietyId"
            />
          </el-select>
        </td>
        <td>
          <el-select
            v-model="form.transferSex"
            placeholder="请选择"
            style="width: 77px"
          >
            <el-option label="公" :value="1" />
            <el-option label="母" :value="2" />
          </el-select>
        </td>
        <td>
          <el-select
            v-model="form.buildingsOut"
            placeholder="请选择"
            style="width: 150px"
          >
            <el-option
              v-for="a in buildingList"
              :label="a.buildingName"
              :value="a.buildingId"
              @click="getcolumnsOu()"
            />
          </el-select>
        </td>

        <td>
          <el-select
            v-model="form.columnsOut"
            placeholder="请选择"
            style="width: 150px"
          >
            <el-option
              v-for="a in columnsO"
              :label="a.columnsName"
              :value="a.columnsId"
            />
          </el-select>
        </td>
        <!-- <td>
                    <el-input v-model="form.malePeriodicWeight" style="width: 165px;" />
                </td> -->
      </tr>
    </table>
  </div>

  <table
    style="margin-top: 200px; width: 1000px; border-collapse: collapse"
    border="1"
  >
    <tr>
      <td>合计</td>
    </tr>
    <tr>
      <td>
        <el-button type="danger" link @click="AddRang()">+增行</el-button>
        <el-button type="danger" link @click="saveRang()">-减行</el-button>
      </td>
    </tr>
    <tr>
      <td>备注:<el-input v-model="form.remark" type="textarea" /></td>
    </tr>
  </table>
</template>
<script setup lang="ts">
import { reactive, ref, onMounted } from "vue";
import axios from "axios";
import { ElMessage } from "element-plus";
import { useRouter } from "vue-router";
const router = useRouter();
const form = reactive({
  Rang: "",
  transferId: 0,
  breedingSheepArchiveId: "",
  buildingsOut: "",
  columnsOut: "",
  buildingsEnter: "",
  columnsEnter: "",
  sheepvarietyId: "",
  transferSex: "",
});
//新增行
function AddRang() {
  form.Rang = "a";
  getBuildingList();
}
//减行
function saveRang() {
  form.Rang = "";
}
const formm = reactive({
  totalCount: 0,
  pageCount: 0,
});
//栏位-下拉框
const columnsOu = ref([]);
const getcolumnsOut = () => {
  axios
    .post("http://localhost:5012/api/Buildings/ColumnsList", {
      buildingId: form.buildingsEnter,
    })
    .then((res) => {
      columnsOu.value = res.data.data;
    });
};
//转出栏位-下拉框
const columnsO = ref([]);
const getcolumnsOu = () => {
  axios
    .post("http://localhost:5012/api/Buildings/ColumnsList", {
      buildingId: form.buildingsOut,
    })
    .then((res) => {
      columnsO.value = res.data.data;
    });
};

//栋舍管理—显示
const buildingList = ref([]);
const getBuildingList = () => {
  axios
    .post("http://localhost:5012/api/Buildings/BuildingList", {
      buildingTypeId: 0,
      buildingName: "",
      buildingPerson: "",
      pageSize: 5,
      pageIndex: 1,
    })
    .then((res) => {
      console.log(res.data.data);
      buildingList.value = res.data.data.data;
      formm.pageCount = res.data.data.pageCount;
      formm.totalCount = res.data.data.totalCount;
    })
    .catch((err) => {
      console.log(err);
    });
};
//耳号下拉框
const bugles = ref([]);
const getsheepvariety = () => {
  axios
    .post("http://localhost:5012/api/SheepFile/BasicInformationList", {})
    .then((res) => {
      console.log(res);
      bugles.value = res.data.data;
    });
};
//下拉框 品种
const sheepvarietyList = ref([]);
const postSheepvarietyBind = () => {
  axios
    .post("http://localhost:5012/api/Breedings/SheepvarietyBind", {})
    .then((res) => {
      console.log(res);
      sheepvarietyList.value = res.data.data;
    });
};
//羊只转舍新增
const Transfer = () => {
  axios
    .post("http://localhost:5012/api/Prompt/TransferAdd", {
      transferId: form.transferId,
      breedingSheepArchiveId: form.breedingSheepArchiveId,
      buildingsOut: form.buildingsOut || 0,
      columnsOut: form.columnsOut || 0,
      buildingsEnter: form.buildingsEnter,
      columnsEnter: form.columnsEnter,
      sheepvarietyId: form.sheepvarietyId,
      transferSex: form.transferSex,
    })
    .then((res) => {
      if (res.data.code == 0) {
        ElMessage.success("添加成功");
        router.push({ name: "SheepTransferList" });
      } else {
        ElMessage.success("添加失败");
      }
    });
};
//羊只转舍反填
const TransferBack = () => {
  axios
    .post("http://localhost:5012/api/Prompt/TransferBack", {
      breedingSheepArchiveId: form.breedingSheepArchiveId,
    })
    .then((res) => {
      console.log(res);
      (form.transferId = res.data.transferId),
        (form.buildingsOut = res.data.data.buildingsOut);
      getcolumnsOu();
      form.columnsOut = res.data.data.columnsOut;
    });
};
onMounted(() => {
  postSheepvarietyBind();
  getsheepvariety();
  getBuildingList();
});
</script>
